<template>
  <div class="homePage">
    <!-- 顶部导航 -->
    <topVue></topVue>

    <!-- banner部分 -->
    <bannerVue></bannerVue>

    <!-- 衣勾选热门产品能力 -->
    <abilityVue></abilityVue>

    <!-- 大图片移动端 -->
    <div class="detailPic relative mg50 hidden-md-and-up">
      <img src="../assets/show.png" style="width: 100%; object-fit: contain;">
      <div class="copyright_1 absolute"><a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">备案号: 鄂ICP备2025095520号-1</a><br>Copyright 2025 武汉精颜科技开发有限公司</div>
    </div>

    <!-- 大图片电脑端 -->
    <div class="detailPic relative mg200 hidden-sm-and-down">
      <img src="../assets/show2.png" style="width: 100%; object-fit: contain;">
      <div class="copyright_2 absolute"><a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">备案号: 鄂ICP备2025095520号-1</a><br>Copyright 2025 武汉精颜科技开发有限公司</div>
    </div>

    
  </div>
</template>

<script>
import topVue from "@/components/top.vue"
import bannerVue from "@/components/banner.vue"
import abilityVue from "@/components/ability.vue";
export default {
  components: { 
    topVue,
    bannerVue,
    abilityVue
  },
  data() {
    return {
      brand: ""
    };
  },
  created(){
    // let userAgent = navigator.userAgent;
    // if (/iPhone|iPad/i.test(userAgent)) {
    //   this.brand = 'Apple';
    // } else if (/HUAWEI/i.test(userAgent)) {
    //   this.brand = 'Huawei';
    // } else if (/Xiaomi/i.test(userAgent)) {
    //   this.brand = 'Xiaomi';
    // } else if (/Samsung/i.test(userAgent)) {
    //   this.brand = 'Samsung';
    // }
    // console.log('当前手机品牌：', this.brand);
    // this.$message('当前手机品牌' + this.brand)
  },
  methods: {},
};
</script>

<style lang="less">
.detailPic {
  width: 100%;
  .copyright_1 {
    width: 100%;
    color: #4E5969;
    left: 0;
    bottom: 14px;
    text-align: center;
    font-size: 10px;
    line-height: 1.6;
    a {
      color: #4E5969;
    }
  }
  .copyright_2 {
    width: 100%;
    color: #4E5969;
    left: 0;
    bottom: 30px;
    text-align: center;
    font-size: 24px;
    line-height: 1.6;
    a {
      color: #4E5969;
    }
  }
}
</style>
